<template>
  <div>
    <router-link class="ivu-btn ivu-btn-primary ivu-btn-large" :to="{ path: '/card_type_add' }"><Icon type="android-add"></Icon> 添加卡类型</router-link>
    <br>
    <br>
    <Table border :context="self" :columns="columns7" :data="data6"></Table>
    <br>
    <Page :total="75" :current="1" @on-change="changePage" show-total></Page>
  </div>
</template>
<script>
  import { requestCardTypeList } from '../../api/api'
  export default {
    data () {
      return {
        page: {},
        self: this,
        columns7: [
          {
            title: '卡名称',
            key: 'name'
//            render (row, column, index) {
//              return `<Icon type="person"></Icon> <strong>${row.name}</strong>`
//            }
          },
          {
            title: '卡类别',
            key: 'card_type'
          },
          {
            title: '卡使用期限',
            key: 'card_live_time'
          },
          {
            title: '使用次数',
            key: 'use_count'
          },
          {
            title: '备注',
            key: 'note'
          },
          {
            title: '状态',
            key: 'status'
          },
          {
            title: '操作',
            key: 'action',
            width: 300,
            align: 'center',
            render (row, column, index) {
              return `<i-button type="primary" size="small" @click="edit(${index})">查看</i-button>
                      <i-button type="primary" size="small" @click="show(${index})">查看</i-button>
                      <i-button type="error" size="small" @click="remove(${index})">删除</i-button>`
            }
          }
        ],
        data6: []
      }
    },
    mounted: function () {
      this.$nextTick(function () {
        this.loadTable()
      })
    },
    methods: {
      loadTable (pram) {
        let e = this
        requestCardTypeList(pram).then(function (resp) {
          console.log(resp)
          e.data6 = resp.data.list
        })
      },
      edit (index) {
        this.$router.push({path: '/card_type_edit?id=' + this.data6[index].id})
      },
      show (index) {
        this.$Modal.info({
          title: '用户信息',
          content: `姓名：${this.data6[index].name}<br>地址：${this.data6[index].address}`
        })
      },
      remove (index) {
//        console.log(this.data6[index])
        console.log(index)
//        this.data6.splice(index, 1)
      },
      changePage (row) {
        this.$nextTick(function () {
          this.loadTable({page: row})
        })
      }
    }
  }
</script>
